@extends('frontend::login.common')
@section('content')
    <div class="mui-taber">
        <span class="active" data-url="{{route('f_Login_login')}}">登录</span>
        <span data-url="{{route('f_Login_register')}}">注册</span>
    </div>
    <form  class="form1 active" method="post" id="login-form">
        {{csrf_field()}}
        <div class="mui-input-group">
            <i class="fa fa-phone"></i>
            <input type="text" name="username" placeholder="请输入编号"  />
        </div>
        <div class="mui-input-group">
            <i class="fa fa-lock"></i>
            <input type="password" name="password" placeholder="6-20位登录密码"  />
        </div>
        <button class="mui-btns btns1" type="button" data-action="{{route('f_Login_login')}}" style="margin-top: 30px;background: #5a92fd;color: #fff;height: 40px;width: 95%;">登录</button>
        <div class="mui-text-right mui-input-group" style=""><a href="{{route('f_Login_retrievePwd')}}">忘记密码</a></div>
{{--        <div class="mui-btns btns1" style="background: crimson"><a target="_blank" style="color: aliceblue;" href="javascript:mui.toast('在未开放敬请期待');">下载app</a></div>--}}

    </form>
@endsection
@push('scripts')
    <script>
        $('.btns1')[0].addEventListener('click',function(){
            var load =  layer.open({type: 2});
            var url = $(this).data('action');
            $.ajax({
                type: 'post',
                url: url,
                dataType: 'json',
                data: $('#login-form').serialize()
            }).done(function (response) {
                if(response.status){
                    tooltips(response.msg,6);
                    setTimeout(function () {
                        location.href = response.url;
                    }, 2000);
                }else{
                    tooltips(response.msg,5);
                }
            }).fail(function (XMLHttpRequest) {
                if (XMLHttpRequest.status == 422) {
                    var errors = XMLHttpRequest.responseJSON.errors;
                    if(typeof errors == 'object') {
                        for (var index in errors) { // 不推荐这样
                            tooltips(errors[index][0]);
                            break;
                        }
                    }else{
                        tooltips(XMLHttpRequest.responseJSON.msg);

                    }
                }else{
                    tooltips('网络异常,请检查连接');
                }

            }).always(function () {
                layer.close(load);
            });

            function tooltips(msg) {
                mui.toast(msg);
            }
        })
    </script>
@endpush